<script setup>
import { NodeToolbar } from '@vue-flow/node-toolbar';
import { Handle, Position, useVueFlow } from '@vue-flow/core'
import { computed } from 'vue';
import BaseNode from '../../other/base/BaseNode.vue';

const props = defineProps({
  data: { type: Object, required: true },
  selected: { type: Boolean, default: false }
});

</script>

<template>
  <BaseNode title="JS 代码块">
  <template #content>
    <div class="content" >
      // js code 
    </div>

    <!-- <Handle id="in" type="source" :position="Position.Top" />
    <Handle id="out" type="target" :position="Position.Bottom" /> -->
  </template>
  </BaseNode>
</template>

<style scoped>
.content{
  background: #222;
  height: max-content;
  min-height: 120px;
  color: aquamarine;
  padding: 10px;
  margin: -24px -20px;
}



.handle {
  width: 10px;
  height: 10px;
  background: #1a192b;
  border: 1px solid white;
  border-radius: 50%;
  position: absolute;
}

.input {
  top: -5px;
  left: 50%;
  transform: translateX(-50%);
}

.output-true {
  top: 50%;
  left: -5px;
  transform: translateY(-50%);
}

.output-false {
  right: -5px;
  top: 50%;
  transform: translateY(-50%);
}
</style>